<template>
    <basic-container>

        <avue-crud :data="dataList" :option="optionList" v-model="obj" :page="page"
                   @refresh-change="refreshChange"
                   @search-change="searchChange"
                   @search-reset="searchReset"
                   @current-change="currentChange"
                   @size-change="sizeChange" @on-load="onLoad">
            <template slot-scope="{row}" slot="menuLeft">
                <el-button type="primary" size="mini" @click="handleAdd">
                    新增
                </el-button>
            </template>
            <template slot-scope="scope" slot="content">
                <el-tooltip class="item" effect="dark" :content="scope.row.content" placement="top">
                    <span>{{scope.row.content}}</span>
                </el-tooltip>
            </template>
        </avue-crud>

        <el-dialog
                title="新增"
                :visible.sync="dialogVisible"
                width="60%"
                :before-close="handleClose">
            <avue-form ref="form"
                       v-model="formData"
                       :option="option"
                       @reset-change="resetChange"
                       @submit="submit">
                <template slot-scope="{row}" slot="totalIntegral">
                    <el-input type="text" disabled v-model="totalIntegral">
                    </el-input>
                </template>
                <template slot-scope="{row}" slot="editInterfral">
                    <el-input type="text" disabled v-model="editInterfral">
                    </el-input>
                </template>
            </avue-form>
        </el-dialog>

    </basic-container>
</template>
<script>
    import {editItemIntergral, getTotalIntegral, list}
        from '@/api/base/member/integralLog'
    import {bannerDescribe} from '@/util/rej'
    import {testPhone, testSpaceSize, isInteger0} from '@/util/util'

    export default {
        data() {
            return {
                dialogVisible: false,
                obj: {},
                page: {
                    pageSize: 10,
                    currentPage: 1,
                    total: 0
                },
                editInterval: '',
                formData: {},
                editInterfral: '',
                totalIntegral: '',
                option: {
                    column: [
                        {
                            // type: "input",
                            label: "店铺名称",
                            prop: "storeId",
                            span: 12,
                            display: true,
                            required: true,
                            // valueDefault:'请选择店铺',
                            // multiple:true,//多选
                            dicUrl: '/base/store/storeIntegra',
                            props: {
                                label: 'storeName' || 'storeSubject',
                                value: 'id',
                            },
                            change: (e) => {
                                if (e.value) {
                                    console.log('eeee', e)
                                    setTimeout(res => {
                                        this.getTotalIntegralFn(e.value)
                                        this.editInterfral = ''
                                    }, 10)
                                }
                            },
                            type: 'tree',
                            rules: [
                                {
                                    required: true,
                                    message: "请选择店铺名称"
                                },
                            ]
                        },
                        {
                            type: "select",
                            label: "操作类型",
                            prop: "operateType",
                            valueDefault: '0',
                            dicData: [
                                {
                                    label: "增加",
                                    value: "0"
                                },
                                {
                                    label: "减少",
                                    value: "1"
                                }
                            ],
                            span: 12,
                            rules: [
                                {
                                    required: true,
                                    message: "选择操作类型",
                                }
                            ],
                            change: ({value}) => {
                                console.log(value)
                                console.log(this.formData.integral)
                                if (this.formData.integral != '') {
                                    this.editInterfral = +this.totalIntegral
                                    if (value == 0) {
                                        this.editInterfral = +this.totalIntegral + +this.formData.integral || 0
                                    } else if (value == 1) {
                                        this.editInterfral = +this.totalIntegral - +this.formData.integral || 0
                                    } else if (value == '') {
                                        this.editInterfral = this.totalIntegral
                                    }
                                }
                            }
                        },
                        {
                            type: "input",
                            label: "积分值",
                            prop: "integral",
                            span: 12,
                            display: true,
                            required: true,
                            rules: [
                                {
                                    required: true,
                                    message: "积分值必须填写",
                                    trigger: 'blur'
                                },
                                {
                                    validator: isInteger0,
                                    trigger: 'blur'
                                }
                            ],
                            change: ({value}) => {
                                if (this.formData.operateType == 0 && value != '') {
                                    this.editInterfral = +this.totalIntegral + +value || 0
                                    this.editInterval = '1'
                                } else if (this.formData.operateType == 1 && value != '') {
                                    this.editInterfral = +this.totalIntegral - +value || 0
                                    this.editInterval = '1'
                                } else if (this.formData.operateType == '' && value != '') {
                                    this.editInterfral = ''
                                    this.editInterval = ''
                                } else {
                                    this.editInterfral = ''
                                    this.editInterval = ''
                                }
                            }
                        },
                        {
                            type: "text",
                            label: "现有积分",
                            prop: "totalIntegral",
                            span: 6,
                            formslot: true,
                            disabled: true,
                        },
                        {
                            type: "input",
                            label: "修改后积分",
                            prop: "editInterfral",
                            span: 6,
                            formslot: true,
                            disabled: true,
                        },
                        {
                            type: "textarea",
                            label: "操作说明",
                            prop: "content",
                            span: 24,
                            display: true,
                            required: true,
                            rules: [
                                {
                                    required: true,
                                    validator: bannerDescribe,
                                    trigger: 'blur'
                                }
                            ]
                        }
                    ],
                    labelPosition: "right",
                    labelWidth: 100,
                    gutter: 0,
                    menuBtn: true,
                    submitBtn: true,
                    submitSize: "mini",
                    submitText: "提交",
                    emptyBtn: true,
                    emptySize: "medium",
                    emptyText: "清空",
                    menuPosition: "center",
                    editInterfral: ''
                },
                dataList: [],
                optionList: {
                    menu: false,
                    size: 'mini',
                    title: '',
                    page: true,
                    align: 'center',
                    menuAlign: 'center',
                    border: true,
                    addBtn: false,
                    column: [
                        {
                            label: '店铺名称',
                            prop: 'storeName',
                            search: true,
                        }, {
                            label: '店铺类型',
                            search: true,
                            prop: 'storeType',
                            type: 'select',
                            dicData: [{
                                value: 0, label: '自营'
                            }, {
                                value: 1, label: '非自营'
                            }]
                        }, {
                            label: '操作类型',
                            search: true,
                            prop: 'operateType',
                            type: 'select',
                            dicData: [{
                                value: 0, label: '增加'
                            }, {
                                value: 1, label: '减少'
                            }]
                        },
                        {
                            label: '积分值',
                            prop: 'integral'
                        },
                        {
                            label: '修改前积分值',
                            prop: 'beforeIntegral'
                        },
                        {
                            label: '修改后积分值',
                            prop: 'currentIntegral'
                        },
                        {
                            label: '操作说明',
                            slot:true,
                            prop: 'content'
                        },
                        {
                            label: '操作人',
                            prop: 'name'
                        },
                        {
                            label: "操作时间",
                            prop: "addTime",
                            type: "date",
                            width: 150,
                            format: "yyyy-MM-dd HH:mm:ss",
                            valueFormat: "yyyy-MM-dd HH:mm:ss",
                        }, {
                            label: "区域",
                            type: "tree",
                            prop: "signingArea",
                            search: true,
                            defaultExpandAll: false,
                            disabled: true,
                            hide: true,
                            dicUrl: '/base/organization/listTreeBylevelM?levelM=3',
                            props: {
                                label: 'name',
                                value: 'id',
                                children: 'childrenNodes'
                            },
                        },
                    ]
                }
            }
        },
        mounted() {
            this.editInterfral = ''
                this.onload(this.page)
            // this.getTotalIntegralFn()
        },
        methods: {
            handleClose() {
                this.$refs.form.resetForm()
                this.$refs.form.clearValidate()
                this.dialogVisible = false
            },
            resetChange() {
                console.log('1111')
                this.$refs.form.clearValidate()
                this.totalIntegral=''
            },
            getTotalIntegralFn(value) {
                getTotalIntegral(value).then(res => {
                    if (res.data.code == 200) {
                        this.totalIntegral = res.data.data.totalIntegral + res.data.data.currentIntegral
                        this.editInterfral = ''
                        this.formData.integral = ''
                    }
                })
            },
            submit(formData, done) {
                editItemIntergral(formData).then(res => {
                    if (res.data.code == 200) {
                        this.$message({
                            type: "success",
                            message: "提交成功"
                        });
                        //操作完成清空页面数据
                        this.$refs.form.resetForm();
                        this.totalIntegral = ''
                        this.$nextTick(() => {
                            this.$refs["form"].clearValidate();
                        });
                        this.onLoad(this.page)
                        this.dialogVisible = false
                        done();
                    } else {
                        this.$message.error(res.data.message)
                        done();
                    }
                });
            },
            // 点击页数
            currentChange(currentPage) {
                this.page.currentPage = currentPage;
                this.onLoad(this.page)
            },
            // 点击页数
            sizeChange(pageSize) {
                this.page.pageSize = pageSize;
                this.onLoad(this.page)
            },
            onLoad(page, params = {}, done) {//页面初始化请求管理员列表
                list(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
                    if (done) {
                        done();
                    }
                    //为了在删除最后一页的最后一条数据时能成功跳转回最后一页的上一页
                    if (res.data.data.length === 0 && this.page.currentPage > 1) {
                        this.page.currentPage -= 1;
                        this.onLoad(this.page);
                    }
                    this.dataList = res.data.data
                    this.page.total = res.data.count
                })
            },
            searchReset() {
                this.query = {};
                this.onLoad(this.page);
            },
            // 搜索框
            searchChange(params, done) {
                this.page.currentPage = 1
                this.query = params;
                this.onLoad(this.page, params, done);
            },
            refreshChange({page, searchForm}) {
                this.onLoad(this.page);
            },
            // 新增
            handleAdd() {
                this.dialogVisible = true
            },
        },
    }
</script>
<style>
</style>